<template>
  <a-modal
    :visible="visible"
    @cancel="cacelClick"
    :bodyStyle="{ paddingTop: '15px' }"
    :footer="null"
  >
    <div style="font-size: 18px; margin-bottom: 15px">提示</div>
    <div>
      正在打包下载文件，请稍后前往
      <span
        style="color: rgb(64, 120, 242); cursor: pointer"
        @click="$router.push({ name: 'Download' })"
        >下载中心1</span
      >
      查看并下载
    </div>
    <div style="text-align: right; margin-top: 20px">
      <a-space>
        <a-button
          type="primary"
          ghost
          style="border: 1px solid #e0e0e6; color: #000; border-radius: 6px"
          @click="cacelClick"
          >取消</a-button
        >

        <a-button
          type="primary"
          style="border: none; border-radius: 6px"
          @click="goDownladClick"
        >
          确定
        </a-button>
      </a-space>
    </div>
  </a-modal>
</template>

<script>
import { reactive, toRefs } from "vue";
import { useRouter } from "vue-router";

export default {
  name: "ExportMdal",
  components: {},
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
  },
  setup(props, context) {
    const router = useRouter();
    
    const state = reactive({
      count: 0,
    });

    const cacelClick = () => {
      context.emit("cacel");
    };

    const goDownladClick=()=>{
      context.emit("cacel");
       router.push({ name: 'Download' })
    }

    return {
      ...toRefs(state),
      cacelClick,
      goDownladClick
    };
  },
};
</script>

<style lang="scss" scoped></style>
